<template>
    <div>
        <el-tabs v-if="false" v-model="activeName" type="border-card" class="elTalblTopStyle" style="margin-left: 1%">
            <el-tab-pane label="通话记录" name="first">
                <ipRecordQuery></ipRecordQuery>
            </el-tab-pane>
            <el-tab-pane label="录音记录" name="second">
                <audioQuery></audioQuery>
            </el-tab-pane>
            <el-tab-pane label="视频记录" name="third">
                <videoQuery></videoQuery>
            </el-tab-pane>
            <el-tab-pane label="消息记录" name="forth">
                <msgQuery></msgQuery>
            </el-tab-pane>
            <el-tab-pane label="操作记录" name="fifth">
                <logQuery></logQuery>
            </el-tab-pane>
        </el-tabs>
        <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect"
                 background-color="#fff"
                 text-color="#606266"
                 active-text-color="#3E64BC">
            <el-menu-item index="ipRecordQuery">通话记录</el-menu-item>
            <!--通话记录只允许查询自己；录音记录隐藏不提供-->
            <el-menu-item v-if="false" index="audioQuery">录音记录</el-menu-item>
            <el-menu-item index="videoQuery">视频记录</el-menu-item>
            <el-menu-item index="msgQuery">消息记录</el-menu-item>
            <el-menu-item index="logQuery">操作记录</el-menu-item>
        </el-menu>
        <div v-if="activeIndex === 'ipRecordQuery'">
            <ipRecordQuery></ipRecordQuery>
        </div>
        <div v-if="activeIndex === 'audioQuery'">
            <audioQuery></audioQuery>
        </div>
        <div v-if="activeIndex === 'videoQuery'">
            <videoQuery></videoQuery>
        </div>
        <div v-if="activeIndex === 'msgQuery'">
            <msgQuery></msgQuery>
        </div>
        <div v-if="activeIndex === 'logQuery'">
            <logQuery></logQuery>
        </div>
    </div>
</template>

<script>
  import ipRecordQuery from './auditQuery/ipRecordQuery.vue';
  import audioQuery from './auditQuery/audioQuery.vue';
  import videoQuery from './auditQuery/videoQuery.vue';
  import msgQuery from './auditQuery/msgQuery.vue';
  import logQuery from './auditQuery/logQuery.vue';

  export default {
    name: 'LogAuditManagement',
    props: {//父组件数据
      FleetId: Number,
      userId: Number,
      UserAccount: String,
    },
    components: {
      ipRecordQuery, audioQuery, videoQuery, msgQuery, logQuery,
    },
    data() {
      return {
        activeName: 'ipRecordQuery',
        activeIndex: 'ipRecordQuery',
      };
    },
    mounted() {

    },
    methods: {
      handleSelect(val) {
        this.activeIndex = val;
        console.log(this.activeIndex);
      },
      //写日志方法
      /**
       * dcId:调度员的ID
       *type:操作类型 1-调度 2-对讲 3-地图 4-会议 5-业务管理 6-系统管理 7-会话
       * status:操作状态字符串
       * describe:操作描述
       * time:操作时间
       * fleetId:集团ID
       * detaiType:小类
       * remark；备注（选填）
       */
      addAudit() {
        let data = {
          dcId: 'wxq1',
          type: 1,
          status: '成功',
          describe: 'wejjfj,新增---',
          time: new Date,
          fleetId: 67,
          detailType: 31,
          remark: 'beis',
        };
        this.GlobalFunc.GlaAddAudit(data);
      },

    },
  };
</script>

<style scoped>
    .elTalblTopStyle {
        font-size: 20px;
        font-family: SourceHanSansCN;
    }

    /deep/ .el-menu {
        height: unset !important;
    }

    /deep/ .el-menu-item {
        font-size: 25px;
        font-weight: bold;

    }

    /deep/ .el-menu-demo /deep/ .el-menu--horizontal /deep/ .el-menu /deep/ .is-active {
        background-color: #909399 !important;
    }

    /deep/ .el-menu-item:focus, /deep/ .el-menu-item:hover {
        background-color: #DADADA !important;
    }

    /deep/ .el-tabs__item {
        font-size: 25px;
    }

    /deep/ .el-form-item__label {
        font-size: 18px;
    }

    /deep/ .el-pagination__total {
        font-size: 18px;
    }

    /deep/ .el-form-item__label {
        font-size: 18px;
    }

    /deep/ .el-input__inner {
        font-size: 18px;
    }

    /deep/ .el-tree-node__label {
        font-size: 16px;
    }

    /deep/ .el-select-dropdown__item {
        font-size: 16px;
    }

    /deep/ .el-icon-close:before {
        font-size: 25px;
    }

    /*分页修改开始*/
    .el-pagination /deep/ .el-pagination__total {
        font-size: 20px;
        line-height: 60px;
    }

    .el-pagination /deep/ button /deep/ .el-icon .el-icon .el-icon-arrow-left {
        font-size: 50px;
        height: 60px;
        width: 40px;
    }

    /deep/ .el-pager li {
        margin-top: 15px;
        height: 60px;
        width: 60px;
        line-height: 60px;
        font-size: 18px;
    }

    /deep/ .el-pagination.is-background .btn-prev, .el-pager li {
        height: 60px;
        width: 60px;
    }

    /deep/ .el-pagination.is-background .btn-next, .el-pager li {
        height: 60px;
        width: 60px;
    }

    /deep/ .el-pagination .btn-prev .el-icon {
        font-size: 40px;
    }

    /deep/ .el-pagination .btn-next .el-icon {
        font-size: 40px;
    }

    /*分页修改结束*/
</style>
